<template>
	<view class="nav">
		<my-topbar @changeActiveIndex="changeActive" :activeIndex="activeIndex" :topbarList="topbarList"
			:bgColor="bgColor" :textColor="textColor">
		</my-topbar>
	</view>
</template>

<script>
	import {
		topbarList
	} from '@/local_data/main/home.js'

	import myTopbar from '@/components/common/my-topbar-animation/my-topbar-animation.vue'

	export default {
		props: ['activeIndex'],
		components: {
			myTopbar
		},
		data() {
			return {
				topbarList: topbarList,
				bgColor: '#F3F4F3',
				textColor: 'red'
			}
		},
		methods: {
			changeActive(id) {
				//console.log(id)
				this.$emit('changeActive',id)
				//this.activeIndex = id
			}
		}
	}
</script>

<style lang="scss" scoped>
	.nav {
		padding-top: 30rpx;
		background-color: #F3F4F3;
	}
</style>
